body {
    margin: 0;
    overflow-x: hidden;
    min-width: 320px;
    background: #fff;
    font-size: 14px;
    line-height: 1.4285em;
    color: rgba(0, 0, 0, .87);
    font-smoothing: antialiased;

}

body ::-webkit-scrollbar-thumb {
    cursor: pointer;
    border-radius: 5px;
    background: rgba(0, 0, 0, .25);
    transition: color .2s ease;
}

body ::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, .1);
    border-radius: 0;
}

.mark-editor, .editor-preview-side {
    line-height: 1.2;
    font-size: 15px;
    word-wrap: break-word;
    color: #525252;
    font-family: Helvetica Neue, NotoSansHans-Regular, AvenirNext-Regular, arial, Hiragino Sans GB, Microsoft Yahei, WenQuanYi Micro Hei, serif;
    ::selection {
        background-color: #cce2ff;
        color: rgba(0, 0, 0, .87);
    }
    body, h1, h2, h3, h4, h5 {
        padding: 0;
        font-family: Helvetica Neue, NotoSansHans-Regular, AvenirNext-Regular, arial, Hiragino Sans GB, Microsoft Yahei, WenQuanYi Micro Hei, Arial, Helvetica, sans-serif;
    }
    blockquote, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul {
        margin: 14px 0;
        line-height: 1.2;
        padding: 0
    }
    blockquote:last-child, h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, ol:last-child, p:last-child, pre:last-child, table:last-child, ul:last-child {
        margin-bottom: 0
    }

    blockquote:first-child, h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, ol:first-child, p:first-child, pre:first-child, table:first-child, ul:first-child {
        margin-top: 0
    }

    p {
        margin: 0;
        line-height: 2
    }

    h1, h2, h3, h4, h5, h6 {
        font-weight: 400
    }

    h1.align-right, h2.align-right, h3.align-right, h4.align-right, h5.align-right, h6.align-right {
        text-align: right
    }

    h1.align-center, h2.align-center, h3.align-center, h4.align-center, h5.align-center, h6.align-center {
        text-align: center
    }

    h1 {
        font-size: 2.25em;
        line-height: 1.2
    }

    h2 {
        padding-bottom: .3em;
        font-size: 1.3em;
        line-height: 1.225;
        border-bottom: 1px solid #eee
    }

    h3 {
        font-size: 1.2em;
        line-height: 1.43
    }

    h4 {
        font-size: 1.1em
    }

    h5 {
        font-size: 1em
    }

    hr {
        border: 0;
        border-bottom: 1px solid #ddd;
        margin-bottom: .5em
    }

    ul {
        padding-left: 28px
    }

    ul ul {
        margin: 0
    }

    ul.task-list {
        list-style: none
    }

    ul.task-list li {
        position: relative
    }

    ul.task-list li .icon.square {
        position: absolute;
        left: -24px;
        top: 1px
    }

    ol {
        padding-left: 28px
    }

    li {
        line-height: 2
    }

    li.align-right {
        text-align: right
    }

    li.align-center {
        text-align: center
    }

    code {
        display: inline-block;
        border-radius: 4px;
        padding: .2em .4em;
        background: #282b2e;
        // background-color: #f7f7f7;
        word-break: break-all;
        font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
        white-space: pre;
        line-height: 1.3;
        margin: -.2em .4em;
        color: #abb2bf;
    }

    pre {
        padding: 16px;
        overflow: auto;
        line-height: 1.45;
        background: #282b2e;
        // background-color: #f7f7f7;
        border: 0;
        color: #abb2bf;
        border-radius: 3px;
        font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace
    }

    pre > code {
        display: inline;
        max-width: 100%;
        padding: 0;
        margin: 0;
        overflow: initial;
        line-height: inherit;
        background-color: transparent;
        border: 0;
        tab-size: 4
    }
    p {
        margin: 0;
        line-height: 2;
    }
    p.align-right {
        text-align: right
    }

    p.align-center {
        text-align: center
    }

    table {
        border-collapse: collapse;
        table-layout: fixed;
        width: 100%;
        line-height: 1.8;
        border-spacing: 0
    }

    table th {
        text-align: left
    }

    table td, table th {
        border: 1px solid #e0e0e0;
        padding: 3px 12px
    }

    table tr:hover td {
        background-color: #f1f1f1
    }

    img {
        max-width: 100%;
        display: inline-block;
        padding: 3px;
        vertical-align: middle
    }

    img.inline {
        height: 1.5em
    }
    blockquote {
        padding: 5px 5px 5px 15px;
        color: #777;
        border-left: 4px solid #ddd
    }

    blockquote.info {
        border-left-color: #5bc0de;
        color: #5bc0de;
        background-color: #f4f8fa
    }

    blockquote.warning {
        background-color: #fcf8f2;
        border-color: #f0ad4e;
        color: #f0ad4e
    }

    blockquote.danger {
        color: #d9534f;
        background-color: #fdf7f7;
        border-color: #d9534f
    }

    blockquote.success {
        background-color: #f3f8f3;
        border-color: #50af51;
        color: #50af51
    }

    .markdown-toc {
        margin: 14px 0
    }

    .markdown-toc:last-child {
        margin-bottom: 0
    }

    .markdown-toc:first-child {
        margin-top: 0
    }

    .markdown-toc ul > ul {
        margin-bottom: 0;
        margin-top: 0
    }
    *, :after, :before {
        box-sizing: inherit;
    }
}




.hljs {
    display: block;
    overflow-x: auto;
    padding: 0.5em;
    color: #abb2bf;
    background: #282c34;
}

.hljs-comment,
.hljs-quote {
    color: #5c6370;
    font-style: italic;
}

.hljs-doctag,
.hljs-keyword,
.hljs-formula {
    color: #c678dd;
}

.hljs-section,
.hljs-name,
.hljs-selector-tag,
.hljs-deletion,
.hljs-subst {
    color: #e06c75;
}

.hljs-literal {
    color: #56b6c2;
}

.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-attribute,
.hljs-meta-string {
    color: #98c379;
}

.hljs-built_in,
.hljs-class .hljs-title {
    color: #e6c07b;
}

.hljs-attr,
.hljs-variable,
.hljs-template-variable,
.hljs-type,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-number {
    color: #d19a66;
}

.hljs-symbol,
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-title {
    color: #61aeee;
}

.hljs-emphasis {
    font-style: italic;
}

.hljs-strong {
    font-weight: bold;
}

.hljs-link {
    text-decoration: underline;
}
